<template>
<div>
	<!-- 修改计划 -->
	    <!-- 加载 -->
    <div class="example">
        <a-spin size="large" tip="Loading..." :spinning="spinning" />
    </div>
	<div v-if="spinning ==false">
		<a-row>
			<a-col :span="3">
				<a-anchor>
					<a-anchor-link href="#API" title="广告组">
					<a-anchor-link href="#Ad-unit" title="推广目的" />
					</a-anchor-link>
					<a-anchor-link href="#API" title="广告计划">
					<a-anchor-link href="#Ad-unit" title="所属广告组" />
					<a-anchor-link href="#Ad-Range" title="投放范围" />
					<a-anchor-link href="#Ad-target" title="投放目标" />
					<a-anchor-link href="#Ad-dstion" title="用户定向" />
					<a-anchor-link href="#Ad-Budget" title="预算与出价" />
					<a-anchor-link href="#Ad-name" title="计划名称" />
					</a-anchor-link>
					<a-anchor-link href="#API" title="广告创意">
					<a-anchor-link href="#Anchor-Props" title="计划名称" />
					<a-anchor-link href="#Anchor-Props" title="设置投放位置" />
					<a-anchor-link href="#Anchor-Props" title="制作创意" />
					<a-anchor-link href="#Anchor-Props" title="创意分类" />
					<a-anchor-link href="#Anchor-Props" title="监测链接" />
					</a-anchor-link>
				</a-anchor>
			</a-col>
			<a-col :span="20">
					<div class="code-box-demo">
						<div class="ad-row-title" id="Ad-unit">
							所属广告组
						</div>
						<div class="ad-group ad-font-size">
								广告组名称：
								<strong>{{datalist.name}}（{{datalist.id}}）</strong>
							</div>
					</div>
					<a-divider />
				<a-form :form="form">
					<div class="code-box-demos" id="Ad-Range">
						<div class="ad-row-title">
							投放范围<span class="">了解详情</span>
						</div>
						<div class="ad-group">
							<a-form-item
								:label="$t('投放范围')"
								:labelCol="{span: 2}"
								:wrapperCol="{span: 200}"
								:required="true"
							>
								<a-radio-group v-decorator="[
								'delivery_range',
								{ rules:[],initialValue: 'DEFAULT'}
								]"
								@change="onrange" button-style="solid">
									<a-radio-button value="DEFAULT" disabled>
										默认
									</a-radio-button>
									<a-radio-button value="UNION" disabled>
										穿山甲 &nbsp; <a-icon type="question-circle" @mousemove="onovers" />
									</a-radio-button>
								</a-radio-group>
							</a-form-item>

					<div v-show="dis">
						<a-form-item
								:label="$t('投放形式')"
								:labelCol="{span: 2}"
								:wrapperCol="{span: 200}"
								:required="true"
							>
								<a-radio-group v-decorator="[
								'union_video_type',
								{ rules:[],initialValue: 'REWARDED_VIDEO'}
								]"
								@change="onunion" button-style="solid">
									<a-radio-button value="REWARDED_VIDEO" disabled>
										激励视频 &nbsp; <a-icon type="question-circle" @mousemove="onovers" />
									</a-radio-button>
									<a-radio-button value="ORIGINAL_VIDEO" disabled>
										原生
									</a-radio-button>
									<a-radio-button value="SPLASH_VIDEO" disabled>
										开屏
									</a-radio-button>
								</a-radio-group>
						<p style="margin-left:100px;" :class="[union_video_type == 'ORIGINAL_VIDEO' ? 'isblock' : 'isnone']" >信息流内广告，包含视频和图片</p>
					</a-form-item>
					</div>
						</div>
					</div>
					<a-divider />
			<div class="code-box-demos" id="Ad-target">
				<div class="ad-row-title">
					投放目标<span class="">了解详情</span>
				</div>
				<!-- 为app时 -->
				<!-- <div :class="[landing_type =='APP' ? 'isblock' : 'isnone']"> -->
					<div class="ad-group">
						<a-form-item :required="true" :labelCol="{span: 2}" :wrapperCol="{span: 200}">
							<span slot="label">
								投放目标&nbsp;
								<a-tooltip title="What do you want others to call you?">
								<a-icon type="question-circle-o" />
								</a-tooltip>
							</span>
							<a-radio-group v-decorator="[
								'pricing',
								{ rules:[],initialValue: 'PRICING_OCPM'}
								]"
								@change="onpricing" button-style="solid">

								<a-radio-button value="PRICING_OCPM" disabled>
									转化量 
								</a-radio-button>
								<a-radio-button value="PRICING_CPC" disabled>
									点击量
								</a-radio-button>
								<a-radio-button value="PRICING_CPM" disabled>
									展示量
								</a-radio-button>
							</a-radio-group>
						</a-form-item>
						<a-form-item
							:label="$t('下载方式')"
							:labelCol="{span: 2}"
							:wrapperCol="{span: 200}"
							:required="true"
						>
							<a-radio-group v-decorator="[
								'download_type',
								{ rules:[],initialValue: 'DOWNLOAD_URL'}
								]"
								@change="ondownload" button-style="solid">

								<a-radio-button value="DOWNLOAD_URL" disabled>
									下载链接 
								</a-radio-button>
								<a-radio-button value="EXTERNAL_URL" disabled>
									落地页
								</a-radio-button>
							</a-radio-group>
						</a-form-item>
						<div :class="[download_type =='DOWNLOAD_URL' ? 'isblock' : 'isnone']">
							<a-form-item
									:label="$t('下载链接')"
									:labelCol="{span: 2}"
									:wrapperCol="{span: 200}"
									:required="true"
								>
								<div class="form-row">
								<a-input v-decorator="[
								'download_url',
								{ rules: [{  message: '请输入下载链接' }],initialValue:' ' }
								]" @change="onexternal" style="width:400px;" placeholder="请填写应用下载链接或使用极速下载服务" />
								<span style="margin-left:5px;color:#2F88FF">选择应用<a-icon type="question-circle" /></span>
								</div>
							</a-form-item>
						</div>

						<div :class="[download_type =='EXTERNAL_URL' ? 'isblock' : 'isnone']">
							<a-form-item
									:label="$t('落地页链接')"
									:labelCol="{span: 2}"
									:wrapperCol="{span: 200}"
									:required="true"
								>
								<div class="form-row">
								<a-input-search v-decorator="[
								'external_url',
								{ rules: [{ message: '请输入落地页链接' }] }
								]" @change="onexternal" style="width:400px;" disabled placeholder="请输入链接，可使用橙子建站提供的链接或第三方链接">
								<a-button slot="enterButton" style="color:#2F88FF">
									使用已有
								</a-button>
								</a-input-search>

								<div class="mfont" v-if="externalurl.url !='' && externalurl.url !=undefined">
									<div style="display:inline-block;"><img :src="externalurl.thumbnail" style="width:50px;height:86px;" alt=""></div>
									<div style="display:inline-block;margin-left:10px;">
										<p><a :href="externalurl.url" target="_blank">{{externalurl.name}}</a></p>
										<p>ID:{{externalurl.siteId}}</p>
									</div>
								</div>
								<!-- <span style="margin-left:5px;color:#2F88FF">快速新页面<a-icon type="file" /></span> -->
								</div>
							</a-form-item>
						</div>
<!-- 
						<div :class="[pricings == 'PRICING_OCPM' ? 'isblock' : 'isnone']">	
							<a-form-item :required="true"  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
								<span slot="label">
									转化目标&nbsp;
									<a-tooltip title="What do you want others to call you?">
									<a-icon type="question-circle-o" />
									</a-tooltip>
								</span>
								<a-button style="margin-left:10px;" type="primary" @click="onconversion" :disabled="external">选择转化目标</a-button>
							</a-form-item>
						</div> -->

						<div v-show="track">
							<!-- <a-form-item :required="true"  :labelCol="{span: 3}" :wrapperCol="{span: 200}">
								<span slot="label">
									转化跟踪方式&nbsp;
									<a-tooltip title="What do you want others to call you?">
									<a-icon type="question-circle-o" />
									</a-tooltip>
								</span>
								<div class="form-row">
								<a-radio-group v-decorator="[
									'text',
									{ rules:[{message: '请选择转化目标' }],initialValue: '2'}
									]"
									button-style="solid">
									<a-radio-button value="1" @click="onappline(1)">
										应用下载SDK
									</a-radio-button>
									<a-radio-button value="2" @click="onappline(2)">
										应用下载API
									</a-radio-button>
									<a-radio-button value="3" @click="onappline(3)">
										应用直达API
									</a-radio-button>
								</a-radio-group>
								</div>
							</a-form-item> -->

							<a-form-item
								:label="$t('转化目标')"
								:labelCol="{span: 2}"
								:wrapperCol="{span: 200}"
								:required="true"
							>
								<div style="display:inline-block;background:#F8F9FA;padding:10px;">已选择：<span>{{trantarget}}</span><i style="margin-left:50px;">付费</i></div>
							</a-form-item>
							
						</div>
						
						<div :class="[download_type =='DOWNLOAD_URL' ? 'isblock' : 'isnone']">
							<a-form-item :required="true" :labelCol="{span: 2}"
											:wrapperCol="{span: 200}">
								<span slot="label">
									应用包名&nbsp;
									<a-tooltip title="What do you want others to call you?">
									<a-icon type="question-circle-o" />
									</a-tooltip>
								</span>
								<div class="form-row">
								<a-input v-decorator="[
								'package',
								{ rules: [{ message: '请输入应用包名' }] }
								]" onchange="onpackage" style="width:400px;margin-left:10px;" placeholder="" />
								</div>
							</a-form-item>
						</div>

							<div :class="[download_type =='EXTERNAL_URL' ? 'isblock' : 'isnone']">
							<a-form-item :labelCol="{span: 2}" :wrapperCol="{span: 200}">
								<span slot="label">
									直达链接&nbsp;
								</span>
								<div class="form-row">
								<a-radio-group v-decorator="[
									'texts',
									{ rules:[{message: '请选择转化目标'}],initialValue:'1'}
									]"
									@change="onopenurl" button-style="solid">
									<a-radio-button value="1">
										不启用
									</a-radio-button>
									<a-radio-button value="2">
										启用
									</a-radio-button>
									<p :class="[openurl ==2 ? 'isblock' : 'isnone']" class="pfont">直达链接仅支持部分App唤起，点击创意将优先跳转App，再根据投放内容跳转相关链接<span class="spanfont">了解详情</span></p>
								</a-radio-group>
								
								</div>
							</a-form-item>

							<div :class="[openurl ==2 ? 'isblock' : 'isnone']">
								<a-form-item :labelCol="{span: 2}"
											:wrapperCol="{span: 200}">
								<span slot="label">
									跳转APP链接&nbsp;
								</span>
								
								<div class="form-row">
								<a-input v-decorator="[
								'open_url',
								{ rules: [{ message: '请填写deeplink链接' }] }
								]" onchange="onpackage" style="width:400px;margin-left:10px;" placeholder="请填写deeplink链接，保证可跳转" />
								</div>
							</a-form-item>
							</div>

						</div>
						
						</div>
					</div>
				<!-- </div> -->
				
				<!-- 为LINK时 -->
				<!-- <div :class="[landing_type =='LINK' ? 'isblock' : 'isnone']">
					<div class="ad-group">
						<a-form-item
							:label="$t('投放形式')"
							:labelCol="{span: 2}"
							:wrapperCol="{span: 200}"
							:required="true"
						>
							<a-button @click="landpage($event,'1')" :type="[landing_page==1 ? 'primary' : '']">下载链接</a-button>
							<a-button @click="landpage($event,'2')" :type="[landing_page==2 ? 'primary' : '']">落地页</a-button>
						</a-form-item>

						<a-form-item
								:label="$t('落地页链接')"
								:labelCol="{span: 2}"
								:wrapperCol="{span: 200}"
								:required="true"
							>
							<div class="form-row">
							<a-input-search v-decorator="[
							'name',
							{ rules: [{ required: true, message: '请输入落地页链接' }] }
							]" style="width:400px;" placeholder="请输入链接，可使用橙子建站提供的链接或第三方链接">
							<a-button slot="enterButton" style="color:#2F88FF">
								使用已有
							</a-button>
							</a-input-search>
							<span style="margin-left:5px;color:#2F88FF">快速新页面<a-icon type="file" /></span>
							</div>
						</a-form-item>

							<div :style="{display:istarget}">	
							<a-form-item :required="true"  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
									<span slot="label">
										转化目标&nbsp;
										<a-tooltip title="What do you want others to call you?">
										<a-icon type="question-circle-o" />
										</a-tooltip>
									</span>
									<a-button style="margin-left:10px;" type="primary">选择转化目标</a-button>
								</a-form-item>
							</div>

							<a-form-item :labelCol="{span: 2}"
										:wrapperCol="{span: 200}">
							<span slot="label">
								直达链接&nbsp;
								<a-tooltip title="What do you want others to call you?">
								<a-icon type="question-circle-o" />
								</a-tooltip>
							</span>
							<div class="form-row">
							<a-input v-decorator="[
							'name',
							{ rules: [{ required: true, message: '' }] }
							]" style="width:400px;margin-left:10px;" placeholder="" />
							</div>
						</a-form-item>
					</div>
				</div> -->

				<!-- 为AWEME -->
				<!-- <div :class="[landing_type =='AWEME' ? 'isblock' : 'isnone']">
					<div class="ad-group">
						<a-form-item
							:label="$t('投放内容')"
							:labelCol="{span: 2}"
							:wrapperCol="{span: 200}"
							:required="true"
						>
							<a-button @click="landpage($event,'1')" :type="[landing_page==1 ? 'primary' : '']">抖音主页（默认）</a-button>
							<a-button @click="landpage($event,'2')" :type="[landing_page==2 ? 'primary' : '']">直播</a-button>
							<a-button @click="landpage($event,'2')" :type="[landing_page==2 ? 'primary' : '']">落地页</a-button>
							
						</a-form-item>

						<a-form-item
								:label="$t('抖音号')"
								:labelCol="{span: 2}"
								:wrapperCol="{span: 200}"
								:required="true"
							>
							<div class="form-row">
							<a-input-search v-decorator="[
							'name',
							{ rules: [{ required: true, message: '请输入落地页链接' }] }
							]" style="width:400px;" placeholder="请输入链接，可使用橙子建站提供的链接或第三方链接">
							<a-button slot="enterButton" style="color:#2F88FF">
								使用已有
							</a-button>
							</a-input-search>
							<span style="margin-left:5px;color:#2F88FF">快速新页面<a-icon type="file" /></span>
							</div>
						</a-form-item>

							<div :style="{display:istarget}">	
							<a-form-item :required="true"  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
									<span slot="label">
										转化类型&nbsp;
										<a-tooltip title="What do you want others to call you?">
										<a-icon type="question-circle-o" />
										</a-tooltip>
									</span>
									<a-button style="margin-left:10px;" type="primary">互动</a-button>
									<a-button style="margin-left:10px;" type="primary">账号关注</a-button>
									<a-button style="margin-left:10px;" type="primary">视频评论</a-button>
									<a-button style="margin-left:10px;" type="primary">分享</a-button>
									<a-button style="margin-left:10px;" type="primary">访问推广详情页</a-button>
								</a-form-item>
							</div>

							<a-form-item :labelCol="{span: 2}"
										:wrapperCol="{span: 200}">
							<span slot="label">
								直达链接&nbsp;
								<a-tooltip title="What do you want others to call you?">
								<a-icon type="question-circle-o" />
								</a-tooltip>
							</span>
							<div class="form-row">
							<a-input v-decorator="[
							'name',
							{ rules: [{ required: true, message: '' }] }
							]" style="width:400px;margin-left:10px;" placeholder="" />
							</div>
						</a-form-item>
					</div>
				</div> -->
				<a-divider />

				<div class="code-box-demos" id="Ad-dstion">
					<div class="ad-row-title">
						用户定向<span class="">了解详情</span>
					</div>
					<p style="margin-top:10px;color:#2F88FF"><a-icon type="copy" />复制已有定向</p>
					<div class="ad-group" style="position:relative;">
						<a-tabs default-active-key="1" @change="callback">
							<!-- 新建定向 -->
							<a-tab-pane key="1" tab="新建定向">
								<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
									<span slot="label">
										地域&nbsp;
										<a-tooltip title="What do you want others to call you?">
										<a-icon type="question-circle-o" />
										</a-tooltip>
									</span>
									<a-radio-group v-decorator="[
									'district',
									{ rules:[],initialValue: 'NONE'}
									]"
								@change="ondistrict" button-style="solid">
										<a-radio-button value="NONE">
											不限
										</a-radio-button>
										<a-radio-button value="CITY">
											省市
										</a-radio-button>
										<a-radio-button value="COUNTY">
											区县
										</a-radio-button>
										<!-- <a-radio-button value="BUSINESS_DISTRICT">
											商圈
										</a-radio-button> -->
									</a-radio-group>
								</a-form-item>

								<!-- 按省 -->
								<div style="width:500px;margin-left:100px;" :class="[district =='CITY' ? 'isblock' : 'isnone']">
									<div class="linkage">
										<a-table :row-selection="rowSelectiondatas" style="display:inline-block;" :customRow="customRow" :style="{width:pixel}" :scroll="{ x: 210, y: 300 }" :pagination="pages" :columns="columnscity" :dataSource="treeData">
											<a slot="name" slot-scope="text">
												{{text.name}}
											<span style="float:right;"><a-icon type="right" /></span>
											</a>
										</a-table>

										<div v-show="sontable" style="display:inline-block;">
											<a-table :row-selection="sonrowSelection" :rowKey="id" :customRow="customRow" style="display:inline-block;" :scroll="{ x: 210, y: 300 }" :pagination="pages" :columns="soncolumns" :dataSource="sontreeData">
												<a slot="name" slot-scope="text">{{ text }}</a>
											</a-table>
										</div>
									</div>

									<div>
										<a-radio-group v-decorator="[
									'location_type',
									{ rules:[],initialValue: 'NONE'}
									]" default-value="CURRENT" @change="onlocation">
											<a-radio value="CURRENT">
												正在该地区的用户
											</a-radio>
											<a-radio value="HOME">
												居住在该地区的用户
											</a-radio>
											<a-radio value="TRAVEL">
												到该地区旅行的用户
											</a-radio>
											<a-radio value="ALL">
												该地区内的所有用户
											</a-radio>
										</a-radio-group>
									</div>
								</div>
								<!-- 按市 -->
								<div style="width:800px;margin-left:100px;" :class="[district =='COUNTY' ? 'isblock' : 'isnone']">

									<!-- <a-input-search placeholder="省市搜索不支持按拼音、拼音首字母" enter-button="搜索" @search="onSearchcity" /> -->
									<div class="byted-select-panel-moduler">
										<div class="byted-select-panel-moduler-header">
											<span class="byted-select-panel-moduler-header-title">省份</span>
										</div>
										<div class="listbox">
											<a-list item-layout="horizontal" :data-source="province" >
												<a-list-item slot="renderItem" slot-scope="item" style="cursor:pointer;" @click="onprovince(item.id)">
													{{item.name}}
													<span style="float:right;"><a-icon type="right" /></span>
												</a-list-item>
											</a-list>
										</div>
									</div>

									<a-divider type="vertical" />
									<div class="byted-select-panel-moduler" v-if="city.length > 0">
										<div class="byted-select-panel-moduler-header">
											<span class="byted-select-panel-moduler-header-title">城市</span>
										</div>
										<div class="listbox">
											<a-list item-layout="horizontal" :data-source="city">
												<a-list-item slot="renderItem" slot-scope="item" style="cursor:pointer;" @click="oncity(item.id)">
													{{item.name}}
													<span style="float:right;"><a-icon type="right" /></span>
												</a-list-item>
											</a-list>
										</div>
									</div>
									
									<!-- 区县全选 -->
									<a-divider type="vertical" />
									<div class="byted-select-panel-moduler" v-if="county.length > 0">
										<div class="byted-select-panel-moduler-header">
											<span class="byted-select-panel-moduler-header-title">县区</span>
										</div>
										<div class="listbox">
											<a-checkbox :checked="is_checkedcity" @change="onallchecked">全选</a-checkbox>
											<div v-for="(item,index) in county" :key="index" style="line-height:30px;">
												<a-checkbox :checked="item.is_checked" @click="oncountyoff(index,item.id)">
													{{item.name}}
												</a-checkbox>
											</div>
										</div>
									</div>
									
									<a-divider type="vertical" />
									<!-- 区县已选 -->
									<div class="byted-select-panel-moduler">
										<div class="byted-select-panel-moduler-header">
											<span class="byted-select-panel-moduler-header-title">已选</span>
										</div>
										<div class="listbox">
											<div v-for="(item,index) in countylist" :key="index" style="line-height:30px;">
												<span>
													{{item.name}}
													<a style="float:right;" @click="oncountydel(item.id)"><a-icon type="delete" /></a>
												</span>
											</div>
										</div>
									</div>

								<div>
										<a-radio-group v-decorator="[
									'location_type',
									{ rules:[],initialValue: 'NONE'}
									]" default-value="CURRENT" @change="onlocation">
											<a-radio value="CURRENT">
												正在该地区的用户
											</a-radio>
											<a-radio value="HOME">
												居住在该地区的用户
											</a-radio>
											<a-radio value="TRAVEL">
												到该地区旅行的用户
											</a-radio>
											<a-radio value="ALL">
												该地区内的所有用户
											</a-radio>
										</a-radio-group>
									</div>
								</div>

								<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
									<span slot="label">
										性别&nbsp;
										<a-tooltip title="What do you want others to call you?">
										<a-icon type="question-circle-o" />
										</a-tooltip>
									</span>
									<a-radio-group v-decorator="[
									'gender',
									{ rules:[],initialValue: 'NONE'}
									]"
								@change="ongender" button-style="solid">
									
										<a-radio-button value="NONE">
											不限
										</a-radio-button>
										<a-radio-button value="GENDER_MALE">
											男
										</a-radio-button>
										<a-radio-button value="GENDER_FEMALE">
											女
										</a-radio-button>
									</a-radio-group>
								</a-form-item>

								<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
									<span slot="label">
										年龄&nbsp;
										<a-tooltip title="What do you want others to call you?">
										<a-icon type="question-circle-o" />
										</a-tooltip>
									</span>

									<div class="label" id="label">
										<a-button @click="onlabel" :type="[agearr.length <=0 ?'primary' : '']" >不限</a-button>
										<a-button @click="label1" :type="label.label1 ? 'primary' : ''">18-23</a-button>
										<a-button @click="label2" :type="label.label2 ? 'primary' : ''">24-30</a-button>
										<a-button @click="label3" :type="label.label3 ? 'primary' : ''">31-40</a-button>
										<a-button @click="label4" :type="label.label4 ? 'primary' : ''">41-49</a-button>
										<a-button @click="label5" :type="label.label5 ? 'primary' : ''">50+</a-button>
									</div>
								</a-form-item>

								<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
									<span slot="label">
										自定义人群&nbsp;
										<a-tooltip title="What do you want others to call you?">
										<a-icon type="question-circle-o" />
										</a-tooltip>
									</span>
									<a-radio-group v-decorator="[
									'retargeting',
									{ rules:[],initialValue: 'NONE'}
									]"
								@change="onretargeting" button-style="solid">
										<a-radio-button value="NONE">
											不限
										</a-radio-button>
										<a-radio-button value="RETARGETINGTAGS">
											自定义人群
										</a-radio-button>
									</a-radio-group>
								</a-form-item>
								<!-- 定向 -->
								<div :class="[retargeting == 'RETARGETINGTAGS' ? 'isblock' : 'isnone']">
										<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
											<span slot="label">
												定向逻辑&nbsp;
												<a-tooltip title="What do you want others to call you?">
												<a-icon type="question-circle-o" />
												</a-tooltip>
											</span>
											<a-radio-group v-decorator="[
												'retargeting',
												{ rules:[],initialValue: 'retargeting_tags_include'}
												]"
											@change="onretargetingtags" button-style="solid">
												<a-radio-button value="retargeting_tags_include">
													定向
												</a-radio-button>
												<a-radio-button value="retargeting_tags_exclude">
													排除
												</a-radio-button>
											</a-radio-group>
										</a-form-item>
										
										<div class="mfont" :class="[retargeting_tags =='retargeting_tags_include' ?'isblock':'isnone']">
											<a-input-search
												style="width:500px;"
												placeholder="请输入人群包名称或ID"
												enter-button="搜索"
												@search="ondmp"
												/>
											<a-table :row-selection="rowSelection" style="width:500px;" :columns="columns" :data-source="tagslist">
												<a slot="name" slot-scope="text">{{ text }}</a>
											</a-table>
											
											<p><a-icon type="info-circle" />第三方人群运算受到限制，部分场景无法选择<a-tooltip title="第三方人群包限制如下
		1. 不支持排除第三方人群包；
		2. 不支持同时使用多个来源的第三方人群包">
											<a-icon type="question-circle-o" />
											</a-tooltip></p>
											<p style="color:#2F88FF;cursor:pointer">
												管理自定义人群包<a-icon type="form" />
											</p>
										</div>

										<div class="mfont" :class="[retargeting_tags =='retargeting_tags_exclude' ?'isblock':'isnone']">
											<a-input-search
											style="width:500px;"
												placeholder="请输入人群包名称或ID"
												enter-button="搜索"

												@search="ondmp"
												/>
											<a-table :row-selection="rowSelections" style="width:500px;" :columns="columns" :data-source="tagslist">
												<a slot="name" slot-scope="text">{{ text }}</a>
											</a-table>
											
											<p><a-icon type="info-circle" />第三方人群运算受到限制，部分场景无法选择<a-tooltip title="第三方人群包限制如下
		1. 不支持排除第三方人群包；
		2. 不支持同时使用多个来源的第三方人群包">
											<a-icon type="question-circle-o" />
											</a-tooltip></p>
											<p style="color:#2F88FF;cursor:pointer">
												管理自定义人群包<a-icon type="form" />
											</p>
										</div>
								</div>

								<a-form-item
									:label="$t('行为兴趣')"
									:labelCol="{span: 2}"
									:wrapperCol="{span: 200}"
									
								>
								<a-radio-group v-decorator="[
												'interest_action_mode',
												{ rules:[],initialValue: 'UNLIMITED'}
												]"
											@change="oninterest" button-style="solid">
									<a-radio-button value="UNLIMITED">
										不限
									</a-radio-button>
									<a-radio-button value="RECOMMEND">
										系统推荐<a-icon type="question-circle-o" />
									</a-radio-button>
									<a-radio-button value="CUSTOM">
										自定义
									</a-radio-button>
								</a-radio-group>
								</a-form-item>
								<!-- 行为兴趣 -->
					<!-- 行为兴趣 -->
								<div :class="[interest =='CUSTOM' ?'isblock':'isnone']">
									<p class="pfont" style="margin-left:100px;">选择有以下行为特征或兴趣特征的用户<span class="spanfont">了解详情</span></p>
									<!-- 行为 -->
									<a-form-item :labelCol="{span: 2}" :wrapperCol="{span: 200}">
										<span slot="label">
											行为&nbsp;
											<a-tooltip title="What do you want others to call you?">
											<a-icon type="question-circle-o" />
											</a-tooltip>
										</span>
										<div style="width:750px; display:inline-block;">
											<div>
												在
												<a-select placeholder="所有行为场景" style="width: 200px" v-decorator="[
												'action_scene',
												{ rules:[],initialValue: ''}
												]" @change="onscene">
													<a-select-option value="E-COMMERCE">
														电商互动行为
													</a-select-option>
													<a-select-option value="NEWS">
														资讯互动行为
													</a-select-option>
													<a-select-option value="APP">
														APP推广互动行为
													</a-select-option>
												</a-select>
												中，选择用户
												<a-select  style="width: 100px" v-decorator="[
												'action_days',
												{ rules:[],initialValue: action_days}
												]" @change="ondays">
													<a-select-option value="7">
														7天
													</a-select-option>
													<a-select-option value="15">
														15天
													</a-select-option>
													<a-select-option value="30">
														30天
													</a-select-option>
													<a-select-option value="60">
														60天
													</a-select-option>
													<a-select-option value="90">
														90天
													</a-select-option>
													<a-select-option value="180">
														180天
													</a-select-option>
													<a-select-option value="365">
														365天
													</a-select-option>
												</a-select>
												内发生的行为:
											</div>
											<div>
												
											<!-- <div class="certain-category-search-wrapper" style="width: 250px"> -->
												<!-- <a-auto-complete
												class="certain-category-search"
												dropdown-class-name="certain-category-search-dropdown"
												:dropdown-match-select-width="false"
												:dropdown-style="{ width: '400px' }"
												style="width: 100%"
												placeholder="请输入类目词或关键词"
												option-label-prop="value"
												@search="oncategoriesword"
												>
												<template slot="dataSource">
													<a-select-option v-for="(opt,index) in datakeyword" :key="index">
														<div style="display:inline-block;">
															{{opt.name}}
															<p class="certain-search-item-count" style="line-height: 22px;font-size: 14px;color: #999;">覆盖数{{opt.num}}</p>
														</div>
														<div style="float:right;display:inline-block;line-height:30px;">
															<span @click="addkeys(opt)">添加</span>
															<a style="margin-left:15px;">查关键词</a>
														</div>
													</a-select-option>
												</template>
												<a-input>
													<a-icon slot="suffix" type="search" class="certain-category-icon" />
												</a-input>
												</a-auto-complete> -->
											<!-- </div> -->
												<a-input-search placeholder="请输入类目词或关键词" style="width: 400px" @search="oncategoriesword" /><span class="spanfont"><a-icon type="check-square" style="margin-left:20px;" />批量添加</span>
												
												<a-tabs :defaultActiveKey="action_key" @change="onaction">
													<a-tab-pane key="action_categories" tab="类目词">
														<div class="content">
															
															<div class="text">
																<div @click="arr1()">
																	<a-checkbox :checked="is_checked_1"><span>全选</span></a-checkbox>
																</div>
																<div v-for="(item,index) in categorieslist" :key="index">
																	<div>
																		<a-checkbox :checked="item.is_checked" @click="checked1(index,item.id)"><span @click="handleChange1(index)">{{item.name}}</span></a-checkbox>
																		<span style="float:right;font-size:14px;line-height:30px;color:rgba(0, 0, 0, 0.65)"><a-icon type="right" /></span>
																	</div>
																</div>
															</div>

															<div class="text" v-if="arr2.length >0">
																<div @click="arrs2()" v-if="arr2.length != 0">
																	<a-checkbox :checked="is_checked_2"><span>全选</span></a-checkbox>
																</div>
																<div v-for="(item,index) in arr2" :key="index">
																	<div>
																		<a-checkbox :checked="item.is_checked" @click="checked2(index,item.id)"><span  @click="handleChange2(index)">{{item.name}}</span></a-checkbox>
																		<span style="float:right;font-size:14px;line-height:30px;color:rgba(0, 0, 0, 0.65)"><a-icon type="right" /></span>
																	</div>
																</div>
															</div>

															<div class="text" v-if="arr3.length >0">
																<div @click="arrs3()" v-if="arr3.length != 0">
																	<a-checkbox :checked="is_checked_3"><span>全选</span></a-checkbox>
																</div>
																<div v-for="(item,index) in arr3" :key="index" >
																	<div @click="handleChange3(index)">
																		<a-checkbox :checked="item.is_checked" @click="checked3(index,item.id)"><span  @click="handleChange2(index)">{{item.name}}</span></a-checkbox>
																	</div>
																</div>
															</div>

															<div class="content2">
																<div class="title">
																	<h3>还可以添加行为：{{350 - titleArr.length}}个</h3>
																	<p style="margin-bottom:0px;"><span>类目词：{{catewords.length}}</span><span style="margin-left:20px;">关键词：{{datakeyword.length}}</span></p>
																	<div>
																		<a-row>
																			<a-col :span="8" style="font-size:14px;color:#333;">
																				全部
																			</a-col>
																			<a-col :span="8" style="font-size:14px;color:#333;">
																				覆盖数
																			</a-col>
																			<a-col :span="8">
																				
																			</a-col>
																		</a-row>
																	</div>
																</div>
																<a-empty style="padding-top:20px;" v-if="titleArr.length <=0" />
																<div style="padding:10px;">
																	<div v-for="(item,index) in titleArr" :key="index">
																		<a-row style="padding:0;">
																			<a-col :span="8">
																				{{item.name}}
																			</a-col>
																			<a-col :span="8">
																				{{item.num}}
																			</a-col>
																			<a-col :span="8" >
																				<span style="font-size:16px;">
																					<a-space>
																						<a @click="querykeys(item.name)"><a-icon type="search" /></a>
																						<a @click="onwords(index)"><a-icon type="delete" /></a>
																					</a-space>
																				</span>
																			</a-col>
																		</a-row>
																	</div>
																</div>
															</div>
														</div>
													</a-tab-pane>
													<a-tab-pane key="action_words" tab="关键词">
														
														<div class="content">
															<div class="text" style="width:400px;">
																<div class="crumbs-tips" style="float:right;font-size:12px;text-align:right;">根据关键词推荐的相关词</div>
																<a-empty style="padding-top:20px;" v-if="keyswordlist.length <=0" />
																<div v-for="(item,index) in keyswordlist" :key="index">
																	<a-col :span="8" style="font-size:14px;padding:5px;">
																		{{item.name}}
																	</a-col>
																	<a-col :span="8" style="font-size:14px;padding:5px;">
																		{{item.num}}
																	</a-col>
																	<a-col :span="8" style="font-size:14px;padding:5px;">
																		<a @click="addkeys(item)">添加</a>
																		<a style="margin-left:20px;" @click="querykeys(item.name)">查关键词</a>
																	</a-col>
																</div>
															</div>

															<div class="content2">
																<div class="title">
																	<h3>还可以添加行为：{{350 - titleArr.length}}个</h3>
																	<p style="margin-bottom:0px;"><span>类目词：{{catewords.length}}</span><span style="margin-left:20px;">关键词：{{datakeyword.length}}</span></p>
																	<div>
																		<a-row>
																			<a-col :span="8" style="font-size:14px;color:#333;">
																				全部
																			</a-col>
																			<a-col :span="8" style="font-size:14px;color:#333;">
																				覆盖数
																			</a-col>
																			<a-col :span="8">
																				
																			</a-col>
																		</a-row>
																	</div>
																</div>

																<a-empty style="padding-top:20px;" v-if="titleArr.length <=0" />
																<div style="padding:10px;">
																	<div v-for="(item,index) in titleArr" :key="index">
																		<a-row style="padding:0;">
																			<a-col :span="8">
																				{{item.name}}
																			</a-col>
																			<a-col :span="8">
																				{{item.num}}
																			</a-col>
																			<a-col :span="8" >
																				<span style="font-size:16px;">
																					<a-space>
																						<a @click="querykeys(item.name)"><a-icon type="search" /></a>
																						<a @click="onwords(index)"><a-icon type="delete" /></a>
																					</a-space>
																				</span>
																			</a-col>
																		</a-row>
																	</div>
																</div>

															</div>
														</div>
													</a-tab-pane>
												</a-tabs>

											</div>
										</div>
									</a-form-item>
									
									<!-- 兴趣 -->
									<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
										<span slot="label">
											兴趣&nbsp;
											<a-tooltip title="What do you want others to call you?">
											<a-icon type="question-circle-o" />
											</a-tooltip>
										</span>
										<div style="width:750px; display:inline-block;">
											<div>
												
											<!-- <div class="certain-category-search-wrapper" style="width: 250px"> -->
												<!-- <a-auto-complete
												class="certain-category-search"
												dropdown-class-name="certain-category-search-dropdown"
												:dropdown-match-select-width="false"
												:dropdown-style="{ width: '400px' }"
												style="width: 100%"
												placeholder="请输入类目词或关键词"
												option-label-prop="value"
												@search="oncategoriesword"
												>
												<template slot="dataSource">
													<a-select-option v-for="(opt,index) in datakeyword" :key="index">
														<div style="display:inline-block;">
															{{opt.name}}
															<p class="certain-search-item-count" style="line-height: 22px;font-size: 14px;color: #999;">覆盖数{{opt.num}}</p>
														</div>
														<div style="float:right;display:inline-block;line-height:30px;">
															<span @click="addkeys(opt)">添加</span>
															<a style="margin-left:15px;">查关键词</a>
														</div>
													</a-select-option>
												</template>
												<a-input>
													<a-icon slot="suffix" type="search" class="certain-category-icon" />
												</a-input>
												</a-auto-complete> -->
											<!-- </div> -->
												<a-input-search placeholder="请输入类目词或关键词" style="width: 400px" @search="oninterestword" /><span class="spanfont"><a-icon type="check-square" style="margin-left:20px;" />批量添加</span>
												
												<a-tabs :defaultActiveKey="actionkey" @change="oninterestkey">
													<a-tab-pane key="interest_categories" tab="类目词">
														<div class="content">
															
															<div class="text">
																<div @click="onarr1()">
																	<a-checkbox :checked="is_checked_s1"><span>全选</span></a-checkbox>
																</div>
																<div v-for="(item,index) in interestlist" :key="index">
																	<div>
																		<a-checkbox :checked="item.is_checked" @click="checkeds1(index,item.id)"><span @click="handleChanges1(index)">{{item.name}}</span></a-checkbox>
																		<span style="float:right;font-size:14px;line-height:30px;color:rgba(0, 0, 0, 0.65)"><a-icon type="right" /></span>
																	</div>
																</div>
															</div>

															<div class="text" v-if="array2.length >0">
																<div @click="onarr2()" v-if="array2.length != 0">
																	<a-checkbox :checked="is_checked_s2"><span>全选</span></a-checkbox>
																</div>
																<div v-for="(item,index) in array2" :key="index">
																	<div>
																		<a-checkbox :checked="item.is_checked" @click="checkeds2(index,item.id)"><span  @click="handleChanges2(index)">{{item.name}}</span></a-checkbox>
																		<span style="float:right;font-size:14px;line-height:30px;color:rgba(0, 0, 0, 0.65)"><a-icon type="right" /></span>
																	</div>
																</div>
															</div>

															<div class="text" v-if="array3.length >0">
																<div @click="onarr3()" v-if="array3.length != 0">
																	<a-checkbox :checked="is_checked_s3"><span>全选</span></a-checkbox>
																</div>
																<div v-for="(item,index) in array3" :key="index" >
																	<div @click="handleChanges3(index)">
																		<a-checkbox :checked="item.is_checked" @click="checkeds3(index,item.id)"><span  @click="handleChanges2(index)">{{item.name}}</span></a-checkbox>
																	</div>
																</div>
															</div>

															<div class="content2">
																<div class="title">
																	<h3>还可以添加行为：{{350 - titleArray.length}}个</h3>
																	<p style="margin-bottom:0px;"><span>类目词：{{titleArray.length}}</span><span style="margin-left:20px;">关键词：0</span></p>
																	<div>
																		<a-row>
																			<a-col :span="8" style="font-size:14px;color:#333;">
																				全部
																			</a-col>
																			<a-col :span="8" style="font-size:14px;color:#333;">
																				覆盖数
																			</a-col>
																			<a-col :span="8">
																				
																			</a-col>
																		</a-row>
																	</div>
																</div>
																<a-empty style="padding-top:20px;" v-if="titleArray.length <=0" />
																<div style="padding:10px;">
																	<div v-for="(item,index) in titleArray" :key="index">
																		<a-row style="padding:0;">
																			<a-col :span="8">
																				{{item.name}}
																			</a-col>
																			<a-col :span="8">
																				{{item.num}}
																			</a-col>
																			<a-col :span="8" >
																				<span style="font-size:16px;">
																					<a-space>
																						<a @click="querykeywork(item.name)"><a-icon type="search" /></a>
																						<a @click="onkeywords(index)"><a-icon type="delete" /></a>
																					</a-space>
																				</span>
																			</a-col>
																		</a-row>
																	</div>
																</div>
															</div>
														</div>
													</a-tab-pane>
													<a-tab-pane key="interest_words" tab="关键词">
														
														<div class="content">
															<div class="text" style="width:400px;">
																<div class="crumbs-tips" style="float:right;font-size:12px;text-align:right;">根据关键词推荐的相关词</div>
																<a-empty style="padding-top:20px;" v-if="interestkeyword.length <=0" />
																<div v-for="(item,index) in interestkeyword" :key="index">
																	<a-col :span="8" style="font-size:14px;padding:5px;">
																		{{item.name}}
																	</a-col>
																	<a-col :span="8" style="font-size:14px;padding:5px;">
																		{{item.num}}
																	</a-col>
																	<a-col :span="8" style="font-size:14px;padding:5px;">
																		<a @click="addkeys(item)">添加</a>
																		<a style="margin-left:20px;" @click="querykeywork(item.name)">查关键词</a>
																	</a-col>
																</div>
															</div>

															<div class="content2">
																<div class="title">
																	<h3>还可以添加行为：{{350 - titleArray.length}}个</h3>
																	<p style="margin-bottom:0px;"><span>类目词：{{titleArray.length}}</span><span style="margin-left:20px;">关键词：0</span></p>
																	<div>
																		<a-row>
																			<a-col :span="8" style="font-size:14px;color:#333;">
																				全部
																			</a-col>
																			<a-col :span="8" style="font-size:14px;color:#333;">
																				覆盖数
																			</a-col>
																			<a-col :span="8">
																				
																			</a-col>
																		</a-row>
																	</div>
																</div>

																<a-empty style="padding-top:20px;" v-if="titleArray.length <=0" />
																<div style="padding:10px;">
																	<div v-for="(item,index) in titleArray" :key="index">
																		<a-row style="padding:0;">
																			<a-col :span="8">
																				{{item.name}}
																			</a-col>
																			<a-col :span="8">
																				{{item.num}}
																			</a-col>
																			<a-col :span="8" >
																				<span style="font-size:16px;">
																					<a-space>
																						<a @click="querykeywork(item.name)"><a-icon type="search" /></a>
																						<a @click="onkeywords(index)"><a-icon type="delete" /></a>
																					</a-space>
																				</span>
																			</a-col>
																		</a-row>
																	</div>
																</div>

															</div>
														</div>
													</a-tab-pane>
												</a-tabs>

											</div>
										</div>
									</a-form-item>
								</div>
								
								<a-form-item :label="$t('抖音达人')" :labelCol="{span: 2}" :wrapperCol="{span: 200}" >

									<a-radio-group v-decorator="[
										'aa',
												{ rules:[],initialValue: 'NONE'}
												]"
											@change="ontiktok" button-style="solid">
										<a-radio-button value="NONE">
											不限
										</a-radio-button>
										<a-radio-button value="RECOMMEND">
											自定义
										</a-radio-button>
									</a-radio-group>
								</a-form-item>

								<div :class="[tiktok =='RECOMMEND' ? 'isblock':'isnone']" style="margin-left:100px;">
									<p class="pfont">通过选择抖音达人或达人所在分类，定向对这些内容感兴趣的用户<span class="spanfont">了解详情</span></p>
									<div>
										定向与以下达人产生
										<a-select  style="width: 200px" v-decorator="[
												'aweme_fan_behaviors',
												{ rules:[],initialValue: 'FOLLOWED_USER'}
												]"  @change="onbehaviors">
											<a-select-option value="FOLLOWED_USER">
												已关注用户
											</a-select-option>
											<a-select-option value="COMMENTED_USER">
												视频互动-已评论用户
											</a-select-option>
											<a-select-option value="LIKED_USER">
												视频互动-已点赞用户
											</a-select-option>
											<a-select-option value="SHARED_USER">
													视频互动-已分享用户
											</a-select-option>
										</a-select>
										互动的用户
									</div>

									<div>
										<p><a-input-search placeholder="支持搜索抖音达人、抖音昵称或抖音达人所在分类" style="width: 400px" @search="ontiktokkey" /></p>
										<a-table :row-selection="rowtiktoktalent" style="display:inline-block;" :scroll="{ x: 300, y: 300 }" :pagination="pages" :columns="talentcolumns" :data-source="tiktoktalent">
											<a slot="name" style="width:200px;" slot-scope="text">
												{{text.value}} 
												<p style="margin:0;line-height:20px;font-size:12px;">粉丝数量：{{text.fans_num_str}}</p>
												<a-icon type="right" v-if="text.son.length >0" style="float:right;" />
											</a>
										</a-table>
										<div style="display:inline-block;margin-left:15px;" v-if="sontiktoktalent.length >0">
											<a-table :row-selection="rowsontiktoktalent" style="display:inline-block;" :scroll="{ x: 300, y: 300 }" :pagination="pages" :columns="sontalentcolumns" :data-source="sontiktoktalent">
												<a slot="name" slot-scope="text">
													{{text.value}}
													<p style="margin:0;line-height:20px;font-size:12px;">粉丝数量：{{text.fans_num_str}}</p>
													<a-icon type="right" v-if="text.son.length >0" style="float:right;" />
												</a>
											</a-table>
										</div>

										<div style="display:inline-block;margin-left:15px;" v-if="threetiktoktalent.length >0">
											<a-table :row-selection="rowthreetiktoktalent" style="display:inline-block;" :scroll="{ x: 300, y: 300 }" :pagination="pages" :columns="threetalentcolumns" :data-source="threetiktoktalent">
												<a slot="name" slot-scope="text">
													{{text.value}}
													<p style="margin:0;line-height:20px;font-size:12px;">粉丝数量：{{text.fans_num_str}}</p>
													<a-icon type="right" v-if="text.son.length >0" style="float:right;" />
												</a>
											</a-table>
										</div>

									</div>

								</div>

								<a-form-item
									:label="$t('媒体定向')"
									:labelCol="{span: 2}"
									:wrapperCol="{span: 200}"
									
								>
									<a-radio-group v-decorator="[
									'superior_popularity_type',
												{ rules:[],initialValue: 'NONE'}
												]"
											@change="onsuperior" button-style="solid">
										<a-radio-button value="NONE">
											不限
										</a-radio-button>
										<a-radio-button value="GAME" :disabled="dis">
											游戏优质媒体
										</a-radio-button>
										<a-radio-button value="RECOMMEND">
											自定义
										</a-radio-button>
									</a-radio-group>
										<p class="mfont"><a-icon type="info-circle" />媒体包仅支持穿山甲、穿山甲-精选游戏广告位</p>
								</a-form-item>

									<!-- 媒体定向  -->
									<div :class="[superior == 'RECOMMEND' ? 'isblock' : 'isnone']">
										<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
											<span slot="label">
												定向逻辑&nbsp;
												<a-tooltip title="What do you want others to call you?">
												<a-icon type="question-circle-o" />
												</a-tooltip>
											</span>
											<a-radio-group default-value="flow_package" @change="onpackage" button-style="solid">
												<a-radio-button value="flow_package">
													定向
												</a-radio-button>
												<a-radio-button value="exclude_flow_package">
													排除
												</a-radio-button>
											</a-radio-group>
										</a-form-item>
										
										<div :class="[packages =='flow_package' ?'isblock':'isnone']" class="mfont">
											<a-input-search
												style="width:500px;"
												placeholder="请输入媒体包名称或ID"
												enter-button="搜索"
												size="large"
												@search="onpackage"
												/>
											<a-table :row-selection="rowpackage" style="width:500px;" :scroll="{ x: 210, y: 300 }" :pagination="pages" :columns="packagelabel" :data-source="packagelist">
												<a slot="name" slot-scope="text">{{ text }}</a>
											</a-table>
											<p style="color:#2F88FF;cursor:pointer">
												管理自定义人群包<a-icon type="form" />
											</p>
										</div>

										<div :class="[packages =='exclude_flow_package' ?'isblock':'isnone']" class="mfont">
											<a-input-search
												style="width:500px;"
												placeholder="请输入媒体包名称或ID"
												enter-button="搜索"
												size="large"
												@search="onpackage"
												/>
											<a-table :row-selection="rowpackages" style="width:500px;" :scroll="{ x: 210, y: 300 }" :pagination="pages" :columns="packagelabel" :data-source="packagelist">
												<a slot="name" slot-scope="text">{{ text }}</a>
											</a-table>
											<p style="color:#2F88FF;cursor:pointer">
												管理自定义人群包<a-icon type="form" />
											</p>
										</div>
									</div>

								<a-form-item
									:label="$t('平台')"
									:labelCol="{span: 2}"
									:wrapperCol="{span: 200}"
									
								>
									<div class="label" id="label">
										<a-button  @click="onplatform" :type="[platform.length <=0 ?'primary' : '']" >不限</a-button>
										<a-button @click="android" :type="label.android ? 'primary' : ''">android</a-button>
										<a-button @click="iOS" :type="label.iOS ? 'primary' : ''">iOS</a-button>
										<a-button @click="PC" :type="label.PC ? 'primary' : ''">PC</a-button>
									</div>
								</a-form-item>

								<!-- <a-form-item
									:label="$t('设备类型')"
									:labelCol="{span: 2}"
									:wrapperCol="{span: 200}"
									:required="true"
								>
								<a-button type="primary">不限</a-button>
								<a-button type="primary">智能手机</a-button>
								<a-button type="primary">平板</a-button>
								</a-form-item> -->

								<a-form-item
									:label="$t('网络')"
									:labelCol="{span: 2}"
									:wrapperCol="{span: 200}"
									
								>
									<div class="label" id="label">
										<a-button @click="onnetworks" :type="[networks.length <=0 ?'primary' : '']" >不限</a-button>
										<a-button @click="wifi" :type="label.wifi ? 'primary' : ''">WIFI</a-button>
										<a-button @click="twog" :type="label.twog ? 'primary' : ''">2G</a-button>
										<a-button @click="threeg" :type="label.threeg ? 'primary' : ''">3G</a-button>
										<a-button @click="forg" :type="label.forg ? 'primary' : ''">4G</a-button>
									</div>
								</a-form-item>

								<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
									<span slot="label">
										已安装用户&nbsp;
										<a-tooltip title="What do you want others to call you?">
										<a-icon type="question-circle-o" />
										</a-tooltip>
									</span>

									<a-radio-group v-decorator="[
									'hide_if_exists',
												{ rules:[],initialValue: '0'}
												]"
											@change="onsuperior" button-style="solid">
										<a-radio-button value="0">
											不限
										</a-radio-button>
										<a-radio-button disabled value="1">
											过滤
										</a-radio-button>
										<a-radio-button value="2">
											定向
										</a-radio-button>
									</a-radio-group>
								</a-form-item>

								<a-form-item  :labelCol="{span: 3}" :wrapperCol="{span: 200}">
									<span slot="label">
										过滤已转化用户&nbsp;
										<a-tooltip title="What do you want others to call you?">
										<a-icon type="question-circle-o" />
										</a-tooltip>
									</span>
									<a-radio-group v-decorator="[
									'hide_if_converted',
												{ rules:[],initialValue: 'NO_EXCLUDE'}
												]"
											@change="onconverted" button-style="solid">
										<a-radio-button value="NO_EXCLUDE">
											不限
										</a-radio-button>
										<a-radio-button value="AD">
											广告计划
										</a-radio-button>
										<a-radio-button value="CAMPAIGN">
											广告组
										</a-radio-button>
										<a-radio-button value="ADVERTISER">
											广告账户
										</a-radio-button>
										<a-radio-button value="APP">
											APP
										</a-radio-button>
										<a-radio-button value="CUSTOMER">
											公司账户
										</a-radio-button>
									</a-radio-group>
									<p style="margin-left:100px;margin-bottom:0;"><a-icon type="info-circle" />过滤已转化不支持投放目标为展示、点击计划，不支持受众预估</p>
								</a-form-item>

								<div v-if="isconverted">
									<a-form-item  :labelCol="{span: 3}" :wrapperCol="{span: 200}">
									<span slot="label">
										过滤时间&nbsp;
										<a-tooltip title="What do you want others to call you?">
										<a-icon type="question-circle-o" />
										</a-tooltip>
									</span>
									<a-radio-group v-decorator="[
									'activate_type',
												{ rules:[],initialValue: 'NO_EXCLUDE'}
												]"
											@change="onconverted" button-style="solid">
										<a-radio-button value="NO_EXCLUDE">
											不限
										</a-radio-button>
										<a-radio-button value="ONE_MONTH">
											1个月
										</a-radio-button>
										<a-radio-button value="THREE_MONTH">
											3个月
										</a-radio-button>
										<a-radio-button value="SIX_MONTH">
											6个月
										</a-radio-button>
										<a-radio-button value="TWELVE_MONTH">
											12个月
										</a-radio-button>
									</a-radio-group>
									</a-form-item>
								</div>

							

								<a-collapse accordion style="background:#fff;border:none;padding:0;">
									<a-collapse-panel key="1" header="显示高级选项" style="border:none;color:Red;">

										<a-form-item :labelCol="{span: 2}" :wrapperCol="{span: 200}">
											<span slot="label">
												文章分类&nbsp;
												<a-tooltip title="What do you want others to call you?">
												<a-icon type="question-circle-o" />
												</a-tooltip>
											</span>

											<a-radio-group default-value="0" v-decorator="[
									'wenzhang',
												{ rules:[],initialValue: '0'}
												]" @change="onarticle" button-style="solid">
												<a-radio-button value="0">
													不限
												</a-radio-button>
												<a-radio-button value="1">
													文章分类
												</a-radio-button>
											</a-radio-group>
										</a-form-item>

										<div :class="[article ==1 ?'isblock':'isnone']" class="mfont">
											<a-table :row-selection="rowarticle" style="width:500px;" :scroll="{ x: 210, y: 300 }" :pagination="pages" :columns="articlelabel" :data-source="articlelist">
												<a slot="name" slot-scope="text">{{ text }}</a>
											</a-table>
										</div>

											<a-form-item
												:label="$t('运行商')"
												:labelCol="{span: 2}"
												:wrapperCol="{span: 200}"
												
											>
												<div class="label" id="label">
													<a-button @click="onoperator" :type="[operator !=undefined && operator.length <=0 ?'primary' : '']" >不限</a-button>
													<a-button @click="MOBILE" :type="label.MOBILE ? 'primary' : ''">移动</a-button>
													<a-button @click="UNICOM" :type="label.UNICOM ? 'primary' : ''">联通</a-button>
													<a-button @click="TELCOM" :type="label.TELCOM ? 'primary' : ''">电信</a-button>
												</div>
											</a-form-item>

										<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
											<span slot="label">
												新用户&nbsp;
												<a-tooltip title="What do you want others to call you?">
												<a-icon type="question-circle-o" />
												</a-tooltip>
											</span>
												<div class="label" id="label">
													<a-button @click="onmonthlist" :type="[monthlist !=undefined && monthlist.length <=0 ?'primary' : '']" >不限</a-button>
													<a-button @click="WITH_IN_A_MONTH" :type="label.WITH_IN_A_MONTH ? 'primary' : ''">一个月以内</a-button>
													<a-button @click="ONE_MONTH_2_THREE_MONTH" :type="label.ONE_MONTH_2_THREE_MONTH ? 'primary' : ''">一个月到三个月</a-button>
													<a-button @click="THREE_MONTH_EAILIER" :type="label.THREE_MONTH_EAILIER ? 'primary' : ''">三个月或更早</a-button>
												</div>
										</a-form-item>

										<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
											<span slot="label">
												手机品牌&nbsp;
												<a-tooltip title="What do you want others to call you?">
												<a-icon type="question-circle-o" />
												</a-tooltip>
											</span>
											<a-radio-group v-decorator="[
									'pinpai',
												{ rules:[],initialValue: '0'}
												]" @change="onbrand" button-style="solid">
												<a-radio-button value="0">
													不限
												</a-radio-button>
												<a-radio-button value="1">
													按品牌
												</a-radio-button>
											</a-radio-group>
										</a-form-item>

										<div :class="[brand ==1 ?'isblock':'isnone']" class="mfont">
											<a-table :row-selection="rowbrand" @getCheckboxProps="getCheckboxProps" style="width:500px;" :scroll="{ x: 210, y: 300 }" :pagination="pages" :columns="brandlabel" :data-source="brandlist">
												<a slot="name" slot-scope="text">{{ text }}</a>
											</a-table>
										</div>

										<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
											<span slot="label">
												手机价格&nbsp;
												<a-tooltip title="What do you want others to call you?">
												<a-icon type="question-circle-o" />
												</a-tooltip>
											</span>
											<a-radio-group v-decorator="[
									'jiage',
												{ rules:[],initialValue: '0'}
												]"  @change="onprice" button-style="solid">
												<a-radio-button value="0">
													不限
												</a-radio-button>
												<a-radio-button value="1">
													自定义
												</a-radio-button>
											</a-radio-group>
										</a-form-item>
										
										<div :class="[launchprice ==1 ?'isblock':'isnone']">
											<a-slider :marks="marks" max="11000" range="true"  @afterChange="onAfterChange" :default-value="pricearr" :tipFormatter="null" :step="500" />

											<p class="pfont">快捷方式:
												<span @click="onlaunch(1)" style="margin-left:20px;" class="spanfont">2000元-4000元</span>
												<span @click="onlaunch(2)" style="margin-left:20px;" class="spanfont">4000元-6000元</span>
												<span @click="onlaunch(3)" style="margin-left:20px;" class="spanfont">6000元-8000元</span>
												<span @click="onlaunch(4)" style="margin-left:20px;" class="spanfont">8000元以上</span>
											</p>

										</div>
		<!-- 
										<div :class="[brand ==1 ?'isblock':'isnone']" class="mfont">
											<a-table :row-selection="rowbrand" style="width:500px;" :scroll="{ x: 210, y: 300 }" :pagination="pages" :columns="brandlabel" :data-source="brandlist">
												<a slot="name" slot-scope="text">{{ text }}</a>
											</a-table>
										</div> -->

										<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
											<span slot="label">
												智能放量&nbsp;
												<a-tooltip title="What do you want others to call you?">
												<a-icon type="question-circle-o" />
												</a-tooltip>
											</span>
											<a-radio-group v-decorator="[
									'auto_extend_enabled',
												{ rules:[],initialValue: '0'}
												]"
											@change="onautoextend" button-style="solid">
												<a-radio-button value="0">
													不启用
												</a-radio-button>
												<a-radio-button value="1">
													启用
												</a-radio-button>
											</a-radio-group>
											<p style="margin-left:100px;margin-bottom:0;"><a-icon type="info-circle" />自能放量不支持受众预估</p>
										</a-form-item>

										<div :class="[enableds ==1 ?'isblock':'isnone']" class="mfont">
											<a-table :row-selection="rowenabled" style="width:500px;" :scroll="{ x: 210, y: 300 }" :pagination="pages" :columns="enabledlabel" :data-source="enabledlist">
												<a slot="name" slot-scope="text">{{ text }}</a>
											</a-table>
										</div>

									</a-collapse-panel>
								</a-collapse>

								<a-button size="large" @click="presedirec" :loading="confirmLoading">
									保存为定向包 
								</a-button>
								<a-tooltip title="将以上定向设置保存为定向包，该定向包可直接在其他广告计划中复用">
								<a-icon type="question-circle-o" style="margin-left:10px;" />
								</a-tooltip>
							</a-tab-pane>
							
							
							<a-tab-pane key="2" tab="选择已有定向" force-render>
								<a-input-search
									style="width:500px;"
									placeholder="选择已有定向包名称"
									enter-button="搜索"
									disabled
									size="large"
									@search="ondmp"
									/>
									<span class="spanfont" style="margin-left:10px;">管理自定义人群包<a-icon type="form" /></span>
								<a-table :row-selection="rowSelection" style="width:500px;" :columns="columns" :data-source="directionallist">
									<a slot="name" slot-scope="text">{{ text }}</a>
								</a-table>
								
								<p><a-icon type="info-circle" />过滤已转化不支持投放目标为展示、点击计划</p>
							</a-tab-pane>
						</a-tabs>
						<!-- 定向信息 -->
							<div class="ad-audience-estimate-wrapper">
								<!-- <div class="ad-audience-estimate-cover">
									<div class="fw-500">预估广告展示数
										<a-tooltip title="根据头条、抖音、西瓜、抖音火山版、穿山甲、穿山甲-精选休闲游戏等广告位展示量计算得出，大于1万时，默认展示最小值">
										<a-icon type="question-circle-o" style="margin-left:10px;" />
										</a-tooltip>
									</div>
									<div class="indicator-wrap">
										<div class="ad-audience-estimate-cover-text">
											今日头条
											<span class="other-covernum bui-num">15.0亿</span>
										</div>
										<div class="ad-audience-estimate-cover-text">
											抖音短视频
											<span class="other-covernum bui-num">30.0亿</span>
										</div>
										<div class="ad-audience-estimate-cover-text">
											西瓜视频
											<span class="other-covernum bui-num">4.0亿</span>
										</div>
										<div class="ad-audience-estimate-cover-text">
											抖音火山版
											<span class="other-covernum bui-num">4.0亿</span>
										</div>
										<div class="ad-audience-estimate-cover-text">
											穿山甲
											<span class="other-covernum bui-num">55.0亿</span>
										</div>
									</div>
								</div> -->

								<div class="ad-audience-estimate-cover" style="background:#fff;">
									<div class="fw-500">预估用户覆盖数
										<a-tooltip title="根据头条、抖音、西瓜、抖音火山版、穿山甲、穿山甲-精选休闲游戏等广告位展示量计算得出，大于1万时，默认展示最小值">
										<a-icon type="question-circle-o" style="margin-left:10px;" />
										</a-tooltip>
									</div>
									<div class="indicator-wrap">
										<div class="ad-audience-estimate-cover-text">
											今日头条
											<span class="other-covernum bui-num">{{tonum(estimate.toutiao.num)}}</span>
										</div>
										<div class="ad-audience-estimate-cover-text">
											抖音短视频
											<span class="other-covernum bui-num">{{tonum(estimate.aweme.num)}}</span>
										</div>
										<div class="ad-audience-estimate-cover-text">
											西瓜视频
											<span class="other-covernum bui-num">{{tonum(estimate.video_app.num)}}</span>
										</div>
										<div class="ad-audience-estimate-cover-text">
											抖音火山版
											<span class="other-covernum bui-num">{{tonum(estimate.hotsoon.num)}}</span>
										</div>
									</div>
									<a-spin size="small" tip="Loading..." :spinning="audienceloading" />

									<div class="ad-audience-estimate-info">
										<p class="ad-audience-estimate-info-name">已选定向信息</p>

										<div class="audience-info" v-if="citylist.length >0">
											<span class="category-label">城市：</span>
											<span class="category-item" v-for="(item,index) in citylist" :key="index">
												{{item.name}}、
											</span>
										</div>

										<div class="audience-info" v-if="countylist.length >0">
											<span class="category-label">地域：</span>
											<span class="category-item" v-for="(item,index) in countylist" :key="index">
												{{item.name}}、
											</span>
										</div>

										<div class="audience-info" :class="[gender != 'NONE' ? 'isblock':'isnone']">
											<span class="category-label">性别：</span>
											<span class="category-item" v-if="gender =='GENDER_MALE'">男</span>
											<span class="category-item" v-if="gender =='GENDER_FEMALE'">女</span>
										</div>

										<div class="audience-info" :class="[agearr.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">年龄：</span>
											<span class="category-item" v-if="label.label1">18-23、</span>
											<span class="category-item" v-if="label.label2">24-30、</span>
											<span class="category-item" v-if="label.label3">31-40、</span>
											<span class="category-item" v-if="label.label4">41-49、</span>
											<span class="category-item" v-if="label.label5">50+</span>
										</div>
										<div class="audience-info" :class="[selectedRows.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">定向人群包：</span>
											<span class="category-item" v-for="item in selectedRows" :key="item.custom_audience_id">
												{{item.name}}、
											</span>
										</div>
										<div class="audience-info" :class="[selectedRowss.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">排除人群包：</span>
											<span class="category-item" v-for="item in selectedRowss" :key="item.custom_audience_id">
												{{item.name}}、
											</span>
										</div>

										<div class="audience-info" :class="[rowpackagelist.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">定向媒体包：</span>
											<span class="category-item" v-for="item in rowpackagelist" :key="item.id">
												{{item.name}}、
											</span>
										</div>

										<div class="audience-info" :class="[rowpackagelists.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">排除媒体包：</span>
											<span class="category-item" v-for="item in rowpackagelists" :key="item.id">
												{{item.name}}、
											</span>
										</div>

										<div class="audience-info" :class="[catewords.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">行为类目词</span>
											<span class="category-item" v-for="item in catewords" :key="item.id">
												{{item.name}}、
											</span>
										</div>

										<div class="audience-info" :class="[datakeyword.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">行为关键词</span>
											<span class="category-item" v-for="item in datakeyword" :key="item.id">
												{{item.name}}、
											</span>
										</div>

										<div class="audience-info" :class="[catewordslist.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">兴趣类目词</span>
											<span class="category-item" v-for="item in catewordslist" :key="item.id">
												{{item.name}}、
											</span>
										</div>

										<div class="audience-info" :class="[datakey.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">兴趣关键词</span>
											<span class="category-item" v-for="item in datakey" :key="item.id">
												{{item.name}}、
											</span>
										</div>

										<div class="audience-info" :class="[rowtiktoktalentlist.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">抖音号分类：</span>
											<span class="category-item" v-for="item in rowtiktoktalentlist" :key="item.id">
												{{item.value}}、
											</span>
										</div>

										<div class="audience-info" :class="[platform.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">平台：</span>
											<span class="category-item" v-if="label.android">android、</span>
											<span class="category-item" v-if="label.iOS">iOS、</span>
											<span class="category-item" v-if="label.PC">PC、</span>
										</div>
										<div class="audience-info" :class="[networks.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">网络：</span>
											<span class="category-item" v-if="label.wifi">WIFI、</span>
											<span class="category-item" v-if="label.twog">2G、</span>
											<span class="category-item" v-if="label.threeg">3g、</span>
											<span class="category-item" v-if="label.forg">4G、</span>
										</div>

										<div class="audience-info" :class="[rowarticlelist.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">文章分类：</span>
											<span class="category-item" v-for="item in rowarticlelist" :key="item.key">
												{{item.name}}、
											</span>
										</div>
										<div class="audience-info" :class="[operator.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">运行商：</span>
											<span class="category-item" v-if="label.MOBILE">移动、</span>
											<span class="category-item" v-if="label.UNICOM">联通、</span>
											<span class="category-item" v-if="label.TELCOM">电信、</span>
										</div>

										<div class="audience-info" :class="[monthlist.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">新用户：</span>
											<span class="category-item" v-if="label.WITH_IN_A_MONTH">一个月以内、</span>
											<span class="category-item" v-if="label.ONE_MONTH_2_THREE_MONTH">一个月到三个月、</span>
											<span class="category-item" v-if="label.THREE_MONTH_EAILIER">三个月或更早、</span>
										</div>

										<div class="audience-info" :class="[rowbrandlist.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">手机品牌：</span>
											<span class="category-item" v-for="item in rowbrandlist" :key="item.key">
												{{item.name}}、
											</span>
										</div>

										<div class="audience-info" :class="[strnum !='' ?'isblock' : 'isnone']">
											<span class="category-label">手机价格：</span>
										<span class="category-item">{{strnum[0]}}以上</span>
										</div>

										<div class="audience-info" :class="[rowenabledlist.length <=0 ?'isnone' : 'isblock']">
											<span class="category-label">可放开定向：</span>
											<span class="category-item" v-for="item in rowenabledlist" :key="item.key">
												{{item.name}}、
											</span>
										</div>

										<div class="audience-info">
											<span class="category-label">过滤已转化用户：</span>
											<span class="category-item">广告计划</span>
										</div>
										<div class="audience-info">
											<span class="category-label">智能放量：</span>
											<span class="category-item">不开启</span>
										</div>
									</div>
									
								</div>
							</div>
					</div>
				</div>
				<a-divider />

				<div class="code-box-demos" id="Ad-Budget">
					<div class="ad-row-title">
						预算与出价<span class="">了解详情</span>
					</div>
					<div class="ad-group" style="position: relative;">
						<a-form-item
							:label="$t('投放场景')"
							:labelCol="{span: 2}"
							:wrapperCol="{span: 200}"
							
						>
							<div class="scene" :class="[sceneselect == 'SMART_BID_CUSTOM' ? 'sceneselect' :'']" disabled>
								<input type="hidden" name="smart_bid_type" value="SMART_BID_CUSTOM" disabled>
								<div class="title">常规投放</div>
								<p>控制成本，尽量消耗完预算</p>
							</div>
							<div class="scene" :class="[sceneselect == 'SMART_BID_CONSERVATIVE' ? 'sceneselect' :'']" disabled>
								<input type="hidden" name="smart_bid_type" value="SMART_BID_CONSERVATIVE" disabled>
								<div class="title">放量投放</div>
								<p>接受成本上浮，尽量消耗更多预算</p>
							</div>
						</a-form-item>

						<div :class="[sceneselect =='SMART_BID_CUSTOM'?'isblock':'isnone']">
							<a-form-item :labelCol="{span: 2}" :wrapperCol="{span: 200}">
								<span slot="label">
									优先跑量&nbsp;
								</span>
							
								<a-radio-group v-decorator="[
									'flow_control_mode',
												{ rules:[],initialValue: 'FLOW_CONTROL_MODE_FAST'}
												]"
											@change="onadjust" button-style="solid">
									
									<a-radio-button value="FLOW_CONTROL_MODE_FAST">
										优先跑量 
									</a-radio-button>
									<a-radio-button value="FLOW_CONTROL_MODE_BALANCE">
										均衡投放
									</a-radio-button>
									<a-radio-button value="FLOW_CONTROL_MODE_SMOOTH">
										优先低成本
									</a-radio-button>
								</a-radio-group>
							</a-form-item>
					
							<a-form-item
								:label="$t('预算')"
								:labelCol="{span: 2}"
								:wrapperCol="{span: 200}"
								:required="true"
							>
							<div class="form-row" style="display:inline-block">
								<a-input-group compact>
									<a-select disabled v-decorator="[
									'budget_mode',
												{ rules:[],initialValue: 'BUDGET_MODE_DAY'}
												]" >
										<a-select-option value="BUDGET_MODE_DAY">
										日预算
										</a-select-option>
										<a-select-option value="BUDGET_MODE_TOTAL">
										总预算
										</a-select-option>
									</a-select>
									<a-input-number style="width: 300px" :min="300" :max="9999999.99" v-decorator="[
							'budget',
							{ rules: [{ required: true, message: '请输入预算，不少于300元，不超过9999999.99元' }] } ]" /> &nbsp;元
									</a-input-group>
							</div>
							</a-form-item>

							<a-form-item
								:label="$t('投放时间')"
								:labelCol="{span: 2}"
								:wrapperCol="{span: 200}"
							>

								<a-radio-group v-decorator="[
									'schedule_type',
												{ rules:[],initialValue: 'SCHEDULE_FROM_NOW'}
												]"
											@change="onschedule" button-style="solid">
									<a-radio-button value="SCHEDULE_FROM_NOW">
										从今天起长期投放
									</a-radio-button>
									<a-radio-button value="SCHEDULE_START_END">
										设置开始和结束日期
									</a-radio-button>
								</a-radio-group>
							</a-form-item>

							<div :class="[schedule_type =='SCHEDULE_START_END' ?'isblock' :'isnone']" class="mfont">
								<a-range-picker @change="ondate" :default-value="[moment(nowtime, dateFormat), moment(nowtime, dateFormat)]" />
							</div>
<!-- 
							<a-form-item
								:label="$t('付费方式')"
								:labelCol="{span: 2}"
								:wrapperCol="{span: 200}"
							>
								<a-radio-group v-decorator="[
								'fufei',
												{ rules:[],initialValue: '0'}
												]"
											button-style="solid">

									<a-radio-button value="0" disabled>
										按展示付费(oCPM)
									</a-radio-button>
								</a-radio-group>
								<p class="pfont mfont">计划首次投放及其之后三个自然日内将获得超成本赔付保障，您可放心新建计划并投放，详见<span class="spanfont">oCPM赔付规则<a-icon type="form" /> </span> </p>
							</a-form-item> -->

							<a-form-item
								:label="$t('目标转化出价')"
								:labelCol="{span: 2}"
								:wrapperCol="{span: 200}"
								:required="true"
							>
							<div class="form-row" style="display:inline-block">
								<a-input-group compact>
									<a-input-number style="width: 300px" :min="0.1" :max="10000" v-decorator="[
							'cpa_bid',
							{ rules: [{ required: true, message: '请输入目标转化出价，不少于0.1元，不超过10000元' }] } ]" /> &nbsp;元&nbsp;&nbsp;请填入必填字段，获取建议出价
									<a-tooltip title="建议出价获取方式：<a class='color:2F88FF'>了解更多</a> 
			请填入本页面所有必填信息（除出价外），即可查看建议出价">
									<a-icon type="question-circle-o" />
									</a-tooltip>
									</a-input-group>
							</div>
							</a-form-item>
						</div>

						<div :class="[sceneselect =='SMART_BID_CONSERVATIVE'?'isblock':'isnone']">
							<a-form-item
								:label="$t('日预算')"
								:labelCol="{span: 2}"
								:wrapperCol="{span: 200}"
								:required="true"
							>
							<div class="form-row" style="display:inline-block">
								<a-input-group compact>
									<a-input-number style="width: 300px" :min="300" :max="9999999.99" v-decorator="[
							'budget',
							{ rules: [{ required: true, message: '请输入预算，不少于300元，不超过9999999.99元' }] } ]" /> &nbsp;元
									</a-input-group>
							</div>
							</a-form-item>
							<!-- <a-form-item
								:label="$t('投放时段')"
								:labelCol="{span: 2}"
								:wrapperCol="{span: 200}"
							>
								<a-radio-group v-decorator="[
							'schedule_time',
							{ rules: [] ,initialValue:'0'}]"  button-style="solid">
									<a-radio-button value="0">
										不限
									</a-radio-button>
									<a-radio-button value="1">
										指定时间段
									</a-radio-button>
								</a-radio-group>
							</a-form-item> -->

							<a-form-item
								:label="$t('目标转化出价')"
								:labelCol="{span: 3}"
								:wrapperCol="{span: 200}"
								:required="true"
							>
								<div class="mfont">
									请填写完上方必填项后获取成本预估<br />
									<!-- <p> -->
										<a-checkbox disabled>
											我的预期成本不在此范围内，我需要在此基础上调整
										</a-checkbox>
									<!-- </p> -->
								</div>
							</a-form-item>
						</div>


							<!-- 右边信息 -->
						<div class="desc-wrapper">
							<div class="single-title">
								每日投放效果
							</div>
							<div class="pic-wrapper">
								<div :class="[sceneselect == 'SMART_BID_CUSTOM' ? 'isblock' :'isnone']">
									<img :src="imgurl('image.jpg')" style="width:300px;" alt="">
								</div>
								<div :class="[sceneselect == 'SMART_BID_CONSERVATIVE' ? 'isblock' :'isnone']">
									<img :src="imgurl('images.jpg')" style="width:300px;" alt="">
								</div>
							</div>
							<div class="desc-line">
								<div class="desc-title">
									适用场景：
								</div>
								<span class="desc-content" :class="[sceneselect == 'SMART_BID_CUSTOM' ? 'isblocks' :'isnone']">
									预算基本花不完，跑量较困难，希望成本相对稳定
								</span>
								<span class="desc-content" :class="[sceneselect == 'SMART_BID_CONSERVATIVE' ? 'isblocks' :'isnone']">
									跑量非常困难或追求激进放量，成本可能上浮
								</span>
							</div>
							<div class="desc-line">
								<div class="desc-title">
									适用场景：
								</div>
								<div class="desc-content" :class="[adjust =='FLOW_CONTROL_MODE_FAST' ? 'isblocks' :'isnone']">
									加速
									<a-tooltip title="尽可能的将广告投放出去，可能会在较短的时间内消耗完预算，也会因为竞争环境的变化导致预算消耗出现较大的波动">
										<a-icon type="question-circle-o" />
										</a-tooltip>
								</div>
								<div class="desc-content" :class="[adjust =='FLOW_CONTROL_MODE_BALANCE' ? 'isblocks' :'isnone']">
									匀速
									<a-tooltip title="系统会优化您的投放，让预算在设定的时间段内稳定的消耗完，以尽可能地从更多流量中挑选最优的流量">
										<a-icon type="question-circle-o" />
										</a-tooltip>
								</div>
								<div class="desc-content" :class="[adjust =='FLOW_CONTROL_MODE_SMOOTH' ? 'isblocks' :'isnone']">
									匀速
									<a-tooltip title="系统会优化您的投放，让预算在设定的时间段内稳定的消耗完，以尽可能地从更多流量中挑选最优的流量">
										<a-icon type="question-circle-o" />
										</a-tooltip>
								</div>
							</div>
							
						</div>
					</div>

					
				</div>
				<a-divider />
				<div class="code-box-demos" id="Ad-name">
					<div class="ad-group">
						<a-form-item  :labelCol="{span: 2}" :wrapperCol="{span: 200}">
						<span slot="label">
							计划名称&nbsp;
							<a-tooltip title="What do you want others to call you?">
							<a-icon type="question-circle-o" />
							</a-tooltip>
						</span>
						<div class="form-row">
						<a-input style="width:400px;" v-decorator="[
						'name',
						{ rules: [{ required: true, message: '请输入计划名称' }],initialValue: name }
						]" placeholder="请输入计划名称" value="name" />
						</div>
						</a-form-item>
					</div>
				</div>
				<a-divider />

				<div class="code-box-demo">
					<div class="ad-group ad-font-size">
						当前广告账户：
						<strong>{{user.name}}（{{datalist.account_id}}）</strong>
					</div>
				</div>
				<a-divider />
				<div class="code-box-demo" style="text-align:right;">
					<a-space>
					<a-button size="large" @click="cancel">
						取消
					</a-button>
					<a-button size="large" @click="savebtn(1)" :loading="logging" type="primary">
						保存并关闭
					</a-button>
					<a-button size="large" @click="savebtn(2)" :loading="logging" type="primary">
						保存并编辑创意
					</a-button>
					</a-space>
				</div>

			</a-form>
			</a-col>
		</a-row>
	</div>
</div>
</template>
<script src="./plans.js"></script>


<style lang="less" scoped>
  .example {
    text-align: center;
    background: rgba(0, 0, 0, 0.05);
    border-radius: 4px;
    margin-bottom: 20px;
    /* padding: 30px 50px; */
    margin: 20px 0;
  }

.convertradio{
	width: 500px;
	padding: 12px 10px 12px 16px;
	display: flex;
	border: 1px solid #dadfe3;
	// margin-right: auto;
}

.convertradio a{
	margin-left: 50px;
	float: right;
	font-size: 14px;
    color: #999;
}

.ant-collapse > .ant-collapse-item > .ant-collapse-header{
	color:#2F88FF;
}

.desc-wrapper{
    position: absolute;
    right: 24px;
    top: 0px;
    height: 364px;
    width: 324px;
    font-family: PingFangSC;
    font-size: 14px;
    line-height: 16px;
    border: 1px solid #EBEBEB;
	border-radius: 4px;
	padding: 12px;
	background: #fff;
	z-index: 1;
}
.single-title{
	margin-top: 7px;
    font-weight: 700;
}

.desc-title{
	color: #333333;
    display: inline-block;
}
.desc-content{
	display: inline-block;
	color:#999;
}

.ant-col-18{
	padding: 0 20px 20px 20px;
}
.ad-row-title{
	font-size: 22px;
}

.isblock{
  display: block;
}

.isblocks{
  display: inline-block;
}


.isnone{
  display: none;
}

.ad-row-title span{
    font-size: 14px;
    line-height: 14px;
    padding-left: 8px;
    margin-left: 0;
    color: #2F88FF;
}

.ad-group{
	padding-left: 20px;
	margin-top: 32px;
	font-size: 14px;
	line-height: 20px;
}

.code-box-demos{
	padding-top:20px;
}

.ant-form-item-control-wrapper{
	display: inline-block !important;
}

// 省市
.byted-select-panel-moduler{
	width: 150px;
	display: inline-block;
	-webkit-box-flex: 0;
	border:1px solid #e0e0e0;
	margin-top:10px;
}

.listbox{
	height: 192px;
    padding: 10px;
    overflow-y: auto;
    position: relative;
}

.byted-select-panel-moduler-header{
	border-bottom: 1px solid #e0e0e0;
    background-color: #fafafa;
    color: #333;
    font-size: 14px;
    line-height: 22px;
    padding: 8px 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.byted-select-panel-moduler-header-title{
	font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
//定向右边内容
.ad-audience-estimate-wrapper{
	width:237px;
	position: absolute;
	right: 0;
	top:0;
	padding: 10px;
}
.ad-audience-estimate-cover{
	background-color: #F8F9FA;
	border-radius: 4px 4px 0 0;
	padding: 10px;
	font-size: 12px;
    color: #333;
    padding: 16px 0 8px 12px;
    border: 1px solid #E4E9ED;
}

.ad-audience-estimate-cover-text{
	display: inline-block;
    max-width: 108px;
    min-width: 100px;
    line-height: 20px;
    margin-bottom: 9px;
    color: #999;
}


.ant-collapse > .ant-collapse-item > .ant-collapse-header{
	color:#2F88FF;
}
.ant-collapse-header{
	color:#2F88FF !important;
}

.other-covernum{
	color: #333;
    font-size: 12px;
}

.category-label{
	color: #333;
}

.category-item{
	color: #999;
}

.pfont{
	color: #999;
	font-size: 12px;
}
.spanfont{
	color: #2F88FF;
	font-size: 12px;
	cursor: pointer;
}

.mfont{
	margin-left: 100px;
}

// 滑动条
#components-slider-demo-mark h4 {
  margin: 0 0 16px;
}
#components-slider-demo-mark .ant-slider-with-marks {
  margin-bottom: 44px;
}

.scene{
	display: inline-block;
	padding: 8px 12px;
    border-radius: 4px;
    background: #ffffff;
    width: 206px;
    border: 1px solid #dadfe3;
	cursor: pointer;
	margin-right: 10px;
}
.scene .title{
	font-family: PingFangSC;
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    color: #d6d6d6;
}
.scene p{
	margin-bottom: 0;
	font-size: 12px;
	 color: #d6d6d6;
}

.sceneselect{
	background: #EBF3FF;
    border: 1px solid #2f88ff;
}

	.content2{
		width:300px;
		height: 300px;
		// padding: 10px;
		border: 1px solid #e0e0e0;
		overflow-y: scroll;
		display: inline-block;
		display: flex;
		flex-direction: column;
		font-size: 12px;
	}
	.content2 .title{
		flex-flow: column;
		display: flex;
		height: 80px;
		padding: 8px 12px;
		background: #f8f9fa;
		border-bottom: 1px solid #dadfe3;
		border-radius: 4px 4px 0 0;
	}
	.content {
		display: flex;
		width: 100%;
	}
	.text{
		width:200px;
		height: 300px;
		padding: 10px;
		border: 1px solid #e0e0e0;
		overflow-y: scroll;
		display: inline-block;
		display: flex;
		flex-direction: column;
		font-size: 22px;
	}
</style>
